<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=800">
<script src="resources/autosizingTest.js"></script>
</head>
<body style="overflow-y: hidden;">
<div style="margin-left: 320px;">
<b id="showRepaintBug">
This test passes if no text is overlapping.<br>
Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize
</b><b>Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize Autosize 
<i id="causeClusterRootToChange2"></i>
</b>
</div>
<div id="causeClusterRootToChange1"><b></b></div>
<script>
if (window.testRunner)
  testRunner.waitUntilDone();
window.requestAnimationFrame(function() {
  document.getElementById('causeClusterRootToChange1').firstChild.innerHTML += "test1";
  window.requestAnimationFrame(function() {
    document.getElementById('causeClusterRootToChange2').innerHTML = "test2";
    window.requestAnimationFrame(function() {
      document.getElementById('showRepaintBug').style.color = "blue";
      if (window.testRunner)
        testRunner.notifyDone();
    });
  });
});
</script>
</body>
</html>
